<script setup>
  import { ref } from 'vue';
  import BlogItem from '@/components/BlogItem.vue'
  import BlogList from '@/components/BlogList.vue'
  import { useBlogsStore } from '@/stores/blog.js'
  const blogsStore = useBlogsStore();
  const blogs = blogsStore.sorted
</script>

<template>
<!--  引入组件-->
  <BlogList>
    <div v-for="blog of blogs">
      <!-- 传递属性 -->
      <BlogItem :blog="blog"></BlogItem>
    </div>
  </BlogList>
</template>

<style scoped>
  li {
    list-style-type: none; /* 移除圆点 */
  }
</style>
